<template>
<div class="spike-marketing-add views-container">
    <el-dialog :visible.sync="dialogVisibleImg" width="50%" custom-class="reset-pwd wlm-form-dialog dialog-table">
        <div class="wlm-form">
            <div class="wlm-form-header wlm-dialog-fixheader">
                <span class="wlm-dialog-inlenr">活动标签</span>
            </div>
            <div class="flex-row flex-justify-c" style="margin:20px 0">
                <img height="600" :src="getPath('miaosha.jpg')" alt="">
            </div>
        </div>
    </el-dialog>
    <el-dialog @close="resetDialogFormData" width="60%" :visible.sync="dialogTableVisible" custom-class="reset-pwd wlm-form-dialog dialog-table">
        <div class="wlm-form" v-if="dialogTableVisible">
            <div class="wlm-form-header wlm-dialog-fixheader">
                <span class="wlm-dialog-inlenr">设置秒杀{{ formFormatData.formData.goods[$index] && formFormatData.formData.dealer_mode==3 ? '&分销' : '' }}</span>
                <div v-if="formFormatData.formData.goods[$index] && formFormatData.formData.dealer_mode==3" style="margin:10px 0;">
                  <span style="font-size: 14px;color: #606266;font-weight:normal;display:inline-block;width:120px;">分销佣金类型</span>
                  <el-radio-group v-model="formFormatData.formData.goods[$index].distribution_type">
                    <el-radio label="1">百分比</el-radio>
                    <el-radio label="2">固定金额</el-radio>
                  </el-radio-group>
                </div>
            </div>
            <el-scrollbar wrap-class="scrollbar-wrapper">
                <div class="wlm-form-content">
                    <div class="wlm-dialog-main">
                        <div class="wlm-dialog-content" v-if="formFormatData.formData.goods[$index]">
                            <div class="flex-row flex-align-c" style="margin-bottom:10px;">
                                <span style="margin-right:10px;">当前商品</span>
                                <img style="margin:0 6px;" height="50" width="50" :src="imgPath" alt="">
                                <p>{{goodsName}}</p>
                            </div>
                            <el-table :data="formFormatData.formData.goods[$index]['attr']" style="width: 100%">
                                <el-table-column label="商品规格">
                                    <template slot-scope="scope">
                                        <p>{{scope.row.title}}</p>
                                    </template>
                                </el-table-column>
                                <el-table-column  label="价格">
                                    <template slot-scope="scope">
                                        <p>{{scope.row.goods_price}}</p>
                                    </template>
                                </el-table-column>
                                <el-table-column  label="库存">
                                    <template slot-scope="scope">
                                        <p>{{scope.row.stock_num}}</p>
                                    </template>
                                </el-table-column>
                                <el-table-column  label="秒杀价">
                                    <template slot-scope="scope">
                                        <el-input-number
                                        class="wlm-input-auto"
                                        :controls="false"
                                        v-model.number="scope.row.price"
                                        style="width:70px;"
                                        :min="0"
                                        :max="((Number(scope.row.goods_price) * 100) - 1)/100"></el-input-number>
                                    </template>
                                </el-table-column>
                                <el-table-column  label="秒杀库存">
                                    <template slot-scope="scope">
                                        <el-input-number class="wlm-input-auto" :controls="false"  :precision="0"  v-model="scope.row.stock" style="width:70px;" :min="0"></el-input-number>
                                    </template>
                                </el-table-column>
                                
                                <!-- <el-table-column  label="会员价">
                                    <template slot-scope="scope">
                                        <el-input-number class="wlm-input-auto" :controls="false"  :precision="0"   v-model="scope.row.member_price" style="width:70px;" :min="0"></el-input-number>
                                    </template>
                                </el-table-column> -->
                                <el-table-column label="是否秒杀">
                                    <template slot-scope="scope">
                                        <el-switch :disabled="$hasFormEdit" :active-value="1" :inactive-value="2" v-model="scope.row.is_use">
                                        </el-switch>
                                    </template>
                                </el-table-column>

                                <div v-if="formFormatData.formData.dealer_mode==3">
                                <el-table-column
                                :label="formFormatData.formData.goods[$index].distribution_type=='1'?'一级佣金比例':'一级佣金金额'"
                                prop="goods[$index].first_grade"
                                :rules="[{ required: true, message: '请输入一级佣金', trigger: 'blur' }]"
                                >
                                  <template slot-scope="scope">
                                      <el-input-number
                                      v-if="formFormatData.formData.goods[$index].distribution_type=='1'"
                                      :controls="false"
                                      :disabled="scope.row.is_use!=1"
                                      :precision="0"
                                      v-model.number="scope.row.first_grade"
                                      class="distribution_type_fenxiao70"
                                      :min="0"
                                      :max="100"></el-input-number>

                                      <el-input-number
                                      v-if="formFormatData.formData.goods[$index].distribution_type=='2'"
                                      :controls="false"
                                      :disabled="scope.row.is_use!=1"
                                      v-model.number="scope.row.first_money"
                                      class="distribution_type_fenxiao70"
                                      :min="0.01"></el-input-number>
                                  </template>
                                  <div class="form-help" v-if="formFormatData.formData.goods[$index].distribution_type=='1'">佣金比例范围 0% - 100%</div>
                                  <div class="form-help" v-if="formFormatData.formData.goods[$index].distribution_type=='2'">单个商品固定佣金大于0</div>
                                </el-table-column>
                                <el-table-column
                                v-if="formFormatData.formData.goods[$index].level==2||formFormatData.formData.goods[$index].level==3"
                                :label="formFormatData.formData.goods[$index].distribution_type=='1'?'二级佣金比例':'二级佣金金额'"
                                prop="goods[$index].second_grade"
                                :rules="[{ required: true, message: '请输入二级佣金', trigger: 'blur' }]"
                                >
                                  <template slot-scope="scope">
                                      <el-input-number
                                      v-if="formFormatData.formData.goods[$index].distribution_type=='1'"
                                      :controls="false"
                                      class="distribution_type_fenxiao70"
                                      v-model.number="scope.row.second_grade"
                                      :precision="0"
                                      :disabled="scope.row.is_use!=1"
                                      :min="0"
                                      :max="100"></el-input-number>

                                      <el-input-number
                                      v-if="formFormatData.formData.goods[$index].distribution_type=='2'"
                                      :controls="false"
                                      :disabled="scope.row.is_use!=1"
                                      class="distribution_type_fenxiao70"
                                      v-model.number="scope.row.second_money"
                                      :min="0.01"></el-input-number>
                                  </template>
                                  <div class="form-help" v-if="formFormatData.formData.goods[$index].distribution_type=='1'">佣金比例范围 0% - 100%</div>
                                  <div class="form-help" v-if="formFormatData.formData.goods[$index].distribution_type=='2'">单个商品固定佣金大于0</div>
                                </el-table-column>
                                <el-table-column
                                v-if="formFormatData.formData.goods[$index].level==3"
                                :label="formFormatData.formData.goods[$index].distribution_type=='1'?'三级佣金比例':'三级佣金金额'"
                                prop="goods[$index].third_grade"
                                :rules="[{ required: true, message: '请输入三级佣金', trigger: 'blur' }]"
                                >
                                  <template slot-scope="scope">
                                      <el-input-number
                                      v-if="formFormatData.formData.goods[$index].distribution_type=='1'"
                                      :controls="false"
                                      :disabled="scope.row.is_use!=1"
                                      class="distribution_type_fenxiao70"
                                      :precision="0"
                                      v-model.number="scope.row.third_grade"
                                      :min="0"
                                      :max="100"></el-input-number>

                                      <el-input-number
                                      v-if="formFormatData.formData.goods[$index].distribution_type=='2'"
                                      :controls="false"
                                      :disabled="scope.row.is_use!=1"
                                      class="distribution_type_fenxiao70"
                                      v-model.number="scope.row.third_money"
                                      :min="0.01"></el-input-number>
                                  </template>
                                  <div class="form-help" v-if="formFormatData.formData.goods[$index].distribution_type=='1'">佣金比例范围 0% - 100%</div>
                                  <div class="form-help" v-if="formFormatData.formData.goods[$index].distribution_type=='2'">单个商品固定佣金大于0</div>
                                </el-table-column>
                              </div>

                            </el-table>
                        </div>
                    </div>
                </div>
            </el-scrollbar>
        </div>
        <footer class="flex-row flex-align-c flex-justify-c wlm-dialog-fixfooter">
            <el-button size="small" type="primary" @click="dialogTableVisible = false">确定</el-button>
        </footer>
    </el-dialog>
    <div class="wlm-form">
        <div class="wlm-form-header">{{`${!!formFormatData.api['editForm']['params']['id']?'编辑':'添加'}秒杀`}}</div>
        <div class="wlm-form-content">
            <el-form  :ref="formFormatData.key" :model="formFormatData.formData" :rules="formFormatData.rules" size="small" label-width="150px" class="retail-form" label-position="right">
                <el-form-item label="活动名称">
                    <el-input v-model.trim="formFormatData.formData.title">
                    </el-input>
                </el-form-item>
                <el-form-item label="活动标签">
                    <el-input style="display: block;" v-model="formFormatData.formData.span">
                    </el-input>
                    <div><span class="form-help">展示在商品详情页 </span>
                        <el-button type="text" @click="dialogVisibleImg = true">点击查看示例</el-button>
                    </div>
                </el-form-item>

                <el-form-item label="活动时间">
                    <el-date-picker
                    @change="changeActTime"
                    :disabled="$hasFormEdit"
                    style="width:360px;"
                    :picker-options="afterOptions"
                    v-model="formFormatData.formData.time"
                    :default-time="[`${`${new Date().getHours()}`.padStart(2,'0')}:${`${new Date().getMinutes()+2}`.padStart(2,'0')}:00`,'23:59:59']"
                    value-format="timestamp"
                    type="datetimerange"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期">
                    </el-date-picker>
                </el-form-item>

                <!-- <el-form-item label="秒杀模式">
                    <el-radio-group @change="changeActTime" v-model="formFormatData.formData.seckill_type">
                        <el-radio :label="1">普通秒杀</el-radio>
                        <el-radio :label="2" disabled>整点秒杀</el-radio>
                    </el-radio-group>
                </el-form-item> -->

                <el-form-item label="活动渠道">
                    <el-checkbox-group v-model="formFormatData.formData.channel">
                      <el-checkbox label="2" v-if="JSON.stringify($store.getters.power).indexOf('wxapp')>-1">微信小程序</el-checkbox>
                  <el-checkbox label="3" v-if="JSON.stringify($store.getters.power).indexOf('H5')>-1">H5</el-checkbox>
                  <el-checkbox label="4" v-if="JSON.stringify($store.getters.power).indexOf('wechat')>-1">微信公众号</el-checkbox>
                  <el-checkbox label="7" v-if="JSON.stringify($store.getters.power).indexOf('aliapp')>-1">支付宝小程序</el-checkbox>
                  <el-checkbox label="9" v-if="JSON.stringify($store.getters.power).indexOf('toutiaoapp')>-1">抖音-头条</el-checkbox>
                    </el-checkbox-group>
                </el-form-item>
                <el-form-item label="每人限购">
                    <!-- <el-input-number  :controls=false :disabled="$hasFormEdit" v-model.number="formFormatData.formData.limit" style="width:10px;">
                        <template slot="append">件</template>
                    </el-input-number> -->
                    <template>
                              <div class="input-slot flex-row flex-align-c flex-justify-s wlm-input-appendbox">
                                  <el-input-number :disabled="$hasFormEdit" :controls=false :min="0" v-model.number="formFormatData.formData.limit"></el-input-number>
                              <div class="wlm-input-append append-right">件</div>
                          </div>
                    </template>
                    <div class="form-help">针对一种商品的购买数量</div>
                </el-form-item>

                 <el-form-item label="活动限购">
                    <template>
                      <div class="input-slot flex-row flex-align-c flex-justify-s wlm-input-appendbox">
                        <el-input-number :disabled="$hasFormEdit" :controls=false :min="0" v-model.number="formFormatData.formData.activity_limit"></el-input-number>
                        <div class="wlm-input-append append-right">件</div>
                      </div>
                    </template>
                </el-form-item>

                <!-- <el-form-item label="每单限购">
                    <template>
                              <div class="input-slot flex-row flex-align-c flex-justify-s wlm-input-appendbox">
                                  <el-input-number :disabled="$hasFormEdit" :controls=false :min="0" v-model.number="formFormatData.formData.order_limit"></el-input-number>
                              <div class="wlm-input-append append-right">件</div>
                          </div>
                    </template>
                </el-form-item>

                <el-form-item label="虚拟销量">
                    <el-input :disabled="$hasFormEdit" v-model="formFormatData.formData.sale" style="width:120px;">
                        <template slot="append">件</template>
                    </el-input>
                </el-form-item> -->

                <el-form-item label="是否分销">
                    <el-radio-group v-model="formFormatData.formData.is_distribution">
                        <el-radio :label="1">分销</el-radio>
                        <el-radio :label="2">不分销</el-radio>
                    </el-radio-group>
                    <div class="form-help">选择分销，佣金比例按照默认规则</div>
                </el-form-item>
                <el-form-item v-if="formFormatData.formData.is_distribution===1" label="分销模式">
                    <el-radio-group v-model="formFormatData.formData.dealer_mode">
                        <el-radio :label="1">分销默认设置</el-radio>
                        <el-radio :label="2">商品单独设置</el-radio>
                        <el-radio :label="3">活动单独设置</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="待付款后取消订单时间" >
                    <el-input @input.native="clearNativeReg(formFormatData.formData,'cancel_time',1)"  v-model="formFormatData.formData.cancel_time">
                        <template slot="append">分钟</template>
                    </el-input>
                </el-form-item>

                <el-form-item label="关注设置">
                  <el-radio-group v-model="formFormatData.formData.wechat_set">
                      <el-radio :label="2">强制关注公众号购买</el-radio>
                      <el-radio :label="1">无</el-radio>
                  </el-radio-group>
                </el-form-item>
                <!--  -->
                <el-form-item v-show="formFormatData.formData.wechat_set===2" label="自定义关注标题文案">
                    <div class="flex-col">
                        <el-input type="textarea" :rows="3" placeholder="请输入引导关注标题文案" v-model="formFormatData.formData.custom_follow_title">
                        </el-input>
                    </div>
                </el-form-item>
                <el-form-item label="给用户贴标签">
                  <el-select v-model="formFormatData.formData.tag_id" multiple placeholder="请选择用户标签">
                    <el-option
                      v-for="(item,index) in labelLists"
                      :key="item.id+''+index"
                      :label="item.name"
                      :value="item.id">
                      {{ item.name }}
                    </el-option>
                  </el-select>
                  <div class="form-help">参与活动后，即可为该用户贴上的标签</div>
                </el-form-item>
                <el-form-item label="活动客服">
                    <el-select v-model="formFormatData.formData.service_id" placeholder="请选择客服">
                      <el-option
                        v-for="item in communityOptions"
                        :key="item.id"
                        :label="item.title"
                        :value="item.id">
                        {{ item.title }}
                      </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="活动对象">
                    <el-radio-group v-model="formFormatData.formData.activity_obj">
                        <el-radio :label="1">所有用户</el-radio>
                        <!-- <el-radio :label="2">会员卡用户</el-radio> -->
                        <el-radio :label="3">用户标签</el-radio>
                        <!-- <el-radio :label="4">会员群体</el-radio> -->
                    </el-radio-group>
                </el-form-item>
                <el-form-item v-if="formFormatData.formData.activity_obj=='3'" label="参与标签">
                  <el-select v-model="formFormatData.formData.spike_tag_id" multiple placeholder="请选择用户标签">
                    <el-option
                      v-for="(item,index) in labelLists"
                      :key="item.id+''+index"
                      :label="item.name"
                      :value="item.id">
                      {{ item.name }}
                    </el-option>
                  </el-select>
                  <div class="form-help">只有符合该标签的用户，才能参与活动</div>
                </el-form-item>
                <el-form-item v-show="!!formFormatData.formData.time && formFormatData.formData.time.length > 0 " label="预热开始时间">
                    <el-date-picker
                      v-model="formFormatData.formData.et_time"
                      :picker-options="etTimePickerOptions" 
                      :disabled="$hasFormEdit" 
                      value-format="timestamp"
                      type="datetime"
                      placeholder="选择日期时间">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="分享图片" ref="businessbackgroundmap">
                    <choose-files ref="chooseFiles" :config="chooseBgConfig" :changeEvt="formFormatFiltersChange"></choose-files>
                    <div class="form-help">推荐尺寸：750X750，尺寸不匹配时，图片将选取部分展示</div>
                </el-form-item>

                <el-form-item label="自定义分享文案">
                    <div class="flex-col">
                        <el-input type="textarea" :rows="3" placeholder="请输入分享文案" v-model="formFormatData.formData.custom_share_content">
                        </el-input>
                    </div>
                </el-form-item>
                <!-- <el-form-item label="会员价">
                    <el-radio-group v-model="formFormatData.formData.is_member">
                        <el-radio :label="1">启用</el-radio>
                        <el-radio :label="0">不启用</el-radio>
                    </el-radio-group>
                </el-form-item> -->

                <el-form-item label="读取设置">
                    <el-radio-group v-model="formFormatData.formData.read_setting">
                        <el-radio :label="1">读取本活动</el-radio>
                        <el-radio :label="2">隐藏本活动</el-radio>
                    </el-radio-group>
                </el-form-item>

                <el-form-item label="秒杀商品">
                    <choose-goods ref="chooseGoods" :config="chooseGoodsConfig" :changeEvt="filtersChange"></choose-goods>
                    <el-button  type="primary" @click="goodsToogle">秒杀商品</el-button>
                    <div class="form-help">选择参加秒杀的商品</div>
                    <el-table v-if="formFormatData.formData.goods!=''" :data="formFormatData.formData.goods" style="width: 100%">
                        <el-table-column prop="date" label="商品">
                            <template slot-scope="scope">
                                <div class="flex-row">
                                    <img class="logo" v-if="scope.row.image && scope.row.image[0]" :src="scope.row.image[0]['file_path']">
                                    <div class="inner-text">
                                        <p>{{scope.row.goods_name}}</p>
                                        <span>￥:{{scope.row.attr[0]['goods_price']}}</span>
                                    </div>
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column  label="库存">
                            <template slot-scope="scope">
                                <p>{{scope.row.stock}}</p>
                            </template>
                        </el-table-column>
                        <el-table-column  label="秒杀设置" width="420">
                            <template slot-scope="scope">
                                <template v-if="!$hasFormEdit">
                                    <div v-if="scope.row.attr && scope.row.attr[0]['spec_id']!=-1">
                                        <el-button plain @click="showDialog(scope,scope.row.image[0]['file_path'],scope.row.goods_name)">设置秒杀价与库存</el-button>
                                    </div>
                                    <div v-if="scope.row.attr && scope.row.attr[0]['spec_id']==-1" class="flex-row" width="200">
                                        <div class="flex-col">
                                            <!-- <el-input placeholder="秒杀价" style="width:120px;" v-model="scope.row.attr[0]['price']" type="number" @blur="spikePriceValidate(scope.row)">
                                            </el-input> -->
                                            <el-input-number
                                            class="wlm-input-auto"
                                            placeholder="秒杀价"
                                            :precision="2"
                                            :controls="false"
                                            :disabled="$hasFormEdit"
                                            v-model.number="scope.row.attr[0]['price']"
                                            style="width:80px;margin-top:24px;"
                                            :min="0"
                                            :max="((Number(scope.row.attr[0].goods_price) * 100) - 1)/100"></el-input-number>
                                            <div class="form-help">秒杀价</div>
                                        </div>
                                        <div class="flex-col" style="margin-left:20px;">
                                            <!-- <el-input placeholder="秒杀库存" style="width:120px;" v-model="scope.row.attr[0]['stock']"> -->
                                              <el-input-number
                                              class="wlm-input-auto"
                                              placeholder="秒杀库存"
                                              :controls="false"
                                              :disabled="$hasFormEdit"
                                              :precision="0"
                                              v-model="scope.row.attr[0]['stock']"
                                              style="width:80px;margin-top:24px;"
                                              :min="0"></el-input-number>
                                              <div class="form-help">秒杀库存</div>
                                            <!-- </el-input> -->
                                        </div>
                                        <!-- <div v-if="formFormatData.formData.is_member===1" class="flex-col" style="margin-left:20px;">
                                            <el-input-number
                                            class="wlm-input-auto"
                                            placeholder="会员价"
                                            :precision="2"
                                            :controls="false"
                                            :disabled="$hasFormEdit"
                                            v-model.number="scope.row.attr[0]['member_price']"
                                            style="width:80px;margin-top:24px;"
                                            :min="0"
                                            :max="((Number(scope.row.attr[0].goods_price) * 100) - 1)/100"></el-input-number>
                                            <div class="form-help">会员价</div>
                                        </div> -->
                                    </div>
                                </template>

                                <template v-if="$hasFormEdit">
                                    <div v-if="scope.row.spec_type==20">
                                        <el-button plain @click="showDialog(scope,scope.row.image[0]['file_path'],scope.row.goods_name)">设置秒杀价与库存</el-button>
                                    </div>
                                    <div v-if="scope.row.spec_type==10" class="flex-row">
                                        <div class="flex-col">
                                            <el-input-number
                                            class="wlm-input-auto"
                                            :controls="false"
                                            v-model.number="scope.row.attr[0]['price']"
                                            style="width:80px;margin-top:24px;"
                                            :min="0"
                                            :max="((Number(scope.row.attr[0]['goods_price']) * 100) - 1)/100"></el-input-number>
                                            <div class="form-help">秒杀价</div>
                                        </div>
                                        <div class="flex-col" style="margin-left:20px;">
                                            <el-input-number
                                            class="wlm-input-auto"
                                            :controls="false"
                                            v-model.number="scope.row.attr[0]['stock']"
                                            style="width:80px;margin-top:24px;"
                                            :min="0"></el-input-number>
                                            <div class="form-help">秒杀库存</div>
                                        </div>
                                        <!-- <div v-if="formFormatData.formData.is_member===1" class="flex-col" style="margin-left:20px;">
                                            <el-input-number
                                            class="wlm-input-auto"
                                            :controls="false"
                                            v-model.number="scope.row.attr[0]['member_price']"
                                            style="width:80px;margin-top:24px;"
                                            :min="0"
                                            :max="((Number(scope.row.attr[0]['goods_price']) * 100) - 1)/100"></el-input-number>
                                            <div class="form-help">会员价</div>
                                        </div> -->
                                    </div>
                                </template>
                            </template>
                        </el-table-column>
                        <!-- <el-table-column  label="虚拟销量">
                            <template slot-scope="scope">
                                <el-input-number class="wlm-input-auto" :controls="false"  :precision="0"  v-model="scope.row.sale" style="width:100px;" :min="0"></el-input-number>
                            </template>
                        </el-table-column> -->
                        <el-table-column label="操作">
                            <template slot-scope="scope">
                                <div class="operation-group">
                                    <el-button v-if="formFormatData.formData.dealer_mode==3" class="wlm-text" type="text" @click="retailTable(scope,scope.row.image[0]['file_path'],scope.row.goods_name)">分销设置</el-button>
                                    <el-button  class="wlm-text" type="text" @click="deleteTable(scope)">删除</el-button>
                                </div>
                            </template>
                        </el-table-column>
                    </el-table>
                </el-form-item>
            </el-form>
        </div>
    </div>
    <div v-cloak class="wlm-fixed-btn flex-row flex-align-c flex-justify-c">
        <el-button size="small" @click="formFormatSubmit({ router: { type: 'replace', path: '/application/spikeMarketing', code: 1 }})" type="primary" :loading="loading">保存</el-button>
        <router-link tag="span" to="/application/spikeMarketing">
            <el-button size="small">返回</el-button>
        </router-link>
    </div>

    <!-- 分销设置 -->
    <el-dialog @close="resetDialogFormData" width="60%" :visible.sync="isShowRetailTable" custom-class="reset-pwd wlm-form-dialog dialog-table">
        <div class="wlm-form" v-if="isShowRetailTable">
            <div class="wlm-form-header wlm-dialog-fixheader">
                <span class="wlm-dialog-inlenr">分销设置</span>
                <div v-if="formFormatData.formData.goods[$index]" style="margin:10px 0;">
                  <span style="font-size: 14px;color: #606266;font-weight:normal;display:inline-block;width:120px;">分销佣金类型</span>
                  <el-radio-group v-model="formFormatData.formData.goods[$index].distribution_type">
                    <el-radio label="1">百分比</el-radio>
                    <el-radio label="2">固定金额</el-radio>
                  </el-radio-group>
                </div>
            </div>

            <el-scrollbar wrap-class="scrollbar-wrapper">
                <div class="wlm-form-content">
                    <div class="wlm-dialog-main">
                        <div class="wlm-dialog-content" v-if="formFormatData.formData.goods[$index]">
                          <div class="flex-row flex-align-c" style="margin-bottom:10px;">
                                <span style="margin-right:10px;">当前商品</span>
                                <img style="margin:0 6px;" height="50" width="50" :src="imgPath" alt="">
                                <p>{{goodsName}}</p>
                            </div>
                            <el-table :data="formFormatData.formData.goods[$index]['attr']" style="width: 100%">
                                <el-table-column label="商品规格">
                                    <template slot-scope="scope">
                                        <p>{{scope.row.title}}</p>
                                    </template>
                                </el-table-column>
                                <el-table-column  label="秒杀价">
                                    <template slot-scope="scope">
                                        <p>{{scope.row.price}}</p>
                                    </template>
                                </el-table-column>
                                <!-- 一级 -->
                                <el-table-column
                                :label="formFormatData.formData.goods[$index].distribution_type=='1'?'一级佣金比例':'一级佣金金额'"
                                prop="goods[$index].first_grade"
                                :rules="[{ required: true, message: '请输入一级佣金', trigger: 'blur' }]"
                                >
                                  <template slot-scope="scope">
                                      <el-input-number
                                      v-if="formFormatData.formData.goods[$index].distribution_type=='1'"
                                      :controls="false"
                                      v-model="scope.row.first_grade"
                                      style="width:110px;"
                                      class="distribution_type_fenxiao"
                                      :min="0"
                                      :precision="0"
                                      :max="100"></el-input-number>
                                      <el-input-number
                                      v-if="formFormatData.formData.goods[$index].distribution_type=='2'"
                                      :controls="false"
                                      v-model.number="scope.row.first_money"
                                      style="width:110px;"
                                      class="distribution_type_fenxiao"
                                      :min="0.01"></el-input-number>
                                  </template>
                                  <div class="form-help" v-if="formFormatData.formData.goods[$index].distribution_type=='1'">佣金比例范围 0% - 100%</div>
                                  <div class="form-help" v-if="formFormatData.formData.goods[$index].distribution_type=='2'">单个商品固定佣金大于0</div>
                                </el-table-column>

                                <el-table-column
                                v-if="formFormatData.formData.goods[$index].level==2||formFormatData.formData.goods[$index].level==3"
                                :label="formFormatData.formData.goods[$index].distribution_type=='1'?'二级佣金比例':'二级佣金金额'"
                                prop="goods[$index].second_grade"
                                :rules="[{ required: true, message: '请输入二级佣金', trigger: 'blur' }]"
                                >
                                  <template slot-scope="scope">
                                      <el-input-number
                                      v-if="formFormatData.formData.goods[$index].distribution_type=='1'"
                                      :controls="false"
                                      style="width:110px;"
                                      class="distribution_type_fenxiao"
                                      v-model.number="scope.row.second_grade"
                                      :min="0"
                                      :max="100"></el-input-number>

                                      <el-input-number
                                      v-if="formFormatData.formData.goods[$index].distribution_type=='2'"
                                      :controls="false"
                                      style="width:110px;"
                                      class="distribution_type_fenxiao"
                                      v-model.number="scope.row.second_money"
                                      :min="0.01"></el-input-number>
                                  </template>
                                  <div class="form-help" v-if="formFormatData.formData.goods[$index].distribution_type=='1'">佣金比例范围 0% - 100%</div>
                                  <div class="form-help" v-if="formFormatData.formData.goods[$index].distribution_type=='2'">单个商品固定佣金大于0</div>
                                </el-table-column>

                                <el-table-column
                                v-if="formFormatData.formData.goods[$index].level==3"
                                :label="formFormatData.formData.goods[$index].distribution_type=='1'?'三级佣金比例':'三级佣金金额'"
                                prop="goods[$index].third_grade"
                                :rules="[{ required: true, message: '请输入三级佣金', trigger: 'blur' }]"
                                >
                                  <template slot-scope="scope">
                                      <el-input-number
                                      v-if="formFormatData.formData.goods[$index].distribution_type=='1'"
                                      :controls="false"
                                      class="distribution_type_fenxiao"
                                      v-model.number="scope.row.third_grade"
                                      :min="0"
                                      :max="100"></el-input-number>

                                      <el-input-number
                                      v-if="formFormatData.formData.goods[$index].distribution_type=='2'"
                                      :controls="false"
                                      class="distribution_type_fenxiao"
                                      v-model.number="scope.row.third_money"
                                      :min="0.01"></el-input-number>
                                  </template>
                                  <div class="form-help" v-if="formFormatData.formData.goods[$index].distribution_type=='1'">佣金比例范围 0% - 100%</div>
                                  <div class="form-help" v-if="formFormatData.formData.goods[$index].distribution_type=='2'">单个商品固定佣金大于0</div>
                                </el-table-column>

                            </el-table>
                        </div>
                    </div>
                </div>
            </el-scrollbar>
        </div>
        <footer class="flex-row flex-align-c flex-justify-c wlm-dialog-fixfooter">
            <el-button size="small" type="primary" @click="isShowRetailTable = false">确定</el-button>
        </footer>
    </el-dialog>
</div>
</template>

<script>
import {
  LeaveList
} from '@/api/distribution'
import ChooseGoods from '@/components/ChooseGoods/index' // 秒杀商品库
import ChooseFiles from '@/components/ChooseFiles/index'
import { checkPositiveInteger } from '@/utils/validate.js'
import {
  addSpike,
  getEditData,
  dealerMemberDetail,
  saveMemberDealerSet
} from '@/api/application'
import {
  labelList
} from '@/api/user'
import {
  communityList
} from '@/api/merchandise'
import mixins from '@/mixins/mixins'
let startTime = null
export default {
  mixins: [mixins.getters('Form')],
  name: 'SpikeMarketingAdd',
  components: {
    ChooseGoods,
    ChooseFiles
  },
  computed: {
    getPath() {
      return function(path) {
        return (path.includes('https://') || path.includes('http://')) ? `${path}` : require(`@/assets/custorm_style/${path}`)
      }
    },
    $hasFormEdit() {
      return this.isFormEdit && this.formFormatData.formData.state !== 1
    },
    $hasFormEnd() {
      return this.isFormEdit && this.formFormatData.formData.state === 3
    },

    // 时间戳取时分
    formatDate() {
      return function(date) {
        date = new Date(date)
        var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'
        var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes())
        return hh + mm
      }
    }
  },

  created() {
    LeaveList().then((response) => {
      const {
        data: {
          data: msgData = []
        }
      } = response
      this.levelData = msgData.data
      this.levelData.unshift(msgData.default_leave)
      this.commission_level = msgData.commission_level
    }),
    // 客服列表
    communityList({ list_rows: 'all' }).then((res) => {
      const { data: { code, data: lists = [] } } = res
      if(code === 1){
        this.communityOptions =lists
      }
      // const { data: { data: msgData = [] } } = response
      // this.communityData = msgData
    }),
    // 标签列表
    labelList({
      name: '',
      checkall: 0,
      Recycle: 1,
      page: 1,
      list_rows: 10000
    }).then(res => {
      if (res.data.code === 1) {
        this.labelLists = res.data.data.data
      }
    })
  },
  mounted() {
    const id = this.$router.currentRoute.query.id
    if (id) {
      getEditData({
        id
      }).then(res => {
        if (res.data.code === 1) {
          // console.log(res)
          // console.log(res.data.data)
          // this.formFormatData.formData = res.data.data
          // this.formFormatData.formData.tag_id = res.data.data.tag_id.split(',').map(Number)
          this.formFormatData.formData.activity_share = 20
          const seckillTime = []
          res.data.data.spikeTimes.forEach(item => {
            this.seckillWeek.push(item.week)
            this.weeks[item.week === 0 ? 6 : item.week - 1].disabled = false
            item.spike_time.map(time => {
              seckillTime.push(this.formatDate(time))
            })
          })
          this.seckillTime = [...new Set(seckillTime)]
          const times = res.data.data.time
          if (times) {
            this.getCountOfWeekX(new Date(times[0]), new Date(times[1]))
          }

          // console.log('//',this.formFormatData.formData,this.seckillWeek,this.seckillTime)
        }
      })
    }
  },
  data() {
    return {
      seckillWeek: [], // 活动周期
      seckillTime: [], // 整点时段
      weeks: [
        {
          name: '周一',
          id: 1,
          disabled: true
        },
        {
          name: '周二',
          id: 2,
          disabled: true
        },
        {
          name: '周三',
          id: 3,
          disabled: true
        },
        {
          name: '周四',
          id: 4,
          disabled: true
        },
        {
          name: '周五',
          id: 5,
          disabled: true
        },
        {
          name: '周六',
          id: 6,
          disabled: true
        },
        {
          name: '周日',
          id: 0,
          disabled: true
        }
      ],

      labelLists: [],
      etTimePickerOptions: {
        disabledDate(time) {
          return !(time.getTime() > Date.now() - 3600 * 24 * 1000 && startTime > time.getTime())
        }
      },
      levelData: [],
      commission_level: '',
      levelDefaultData: [],

      loading: false,
      $index: -1,
      dialogTableVisible: false,
      dialogVisibleImg: false,
      imgPath: '',
      goodsName: '',
      currentRow: [],
      chooseBgConfig: {
        type: ['image'],
        model: 'display',
        uploadConfig: {
          limit: 1,
          isMore: true,
          model: 'display'
        },
        isUnique: true,
        initList: [],
        isShowList: true,
        file_type: 'image',
        bindKey: {
          key: 'share_image_id',
          model: 'img'
        }
      },
      chooseGoodsConfig: {
        type: ['chooseGoods'],
        model: 'normal',
        params: {
          indexType: 'spike'
        },
        seckill: 'seckills',
        disabled: [{
          label: 'sale_type',
          value: 0,
          reverse: true
        },
        {
          label: 'member_exclusive',
          value: 1
        }],
        initList: []
      },
      platformConfig: {
        type: ['image'],
        initList: [],
        isMore: false,
        bindKey: {
          key: 'image',
          model: 'img'
        }
      },
      chooseData: [],

      communityOptions: [],
      // 分销
      isShowRetailTable: false,
      formFormatDataRetail: {
        key: 'userForm',
        api: {
          editForm: {
            api: dealerMemberDetail,
            params: {
              card_id: ''
            },
            redirect: 'card_id'
          },
          submitForm: saveMemberDealerSet
        },
        formData: {
          ids: [],
          card_title: '',
          card_price: '',
          extension_text: '',
          extension_img: [],
          is_distribution: 1,
          is_ind_dealer: 1,
          dealer_money_type: 10,
          //   sku: [],
          spec_type: '',
          dealer: [],
          checKLabelList: []
        },
        rules: {
        }
      },
      formFormatData: {
        key: 'userForm',
        model: {
          noCreateEdit: false,
          bindDialog: 'dialogTableVisible'
        },
        api: {
          editForm: {
            api: getEditData,
            params: {
              id: ''
            },
            filters: {
              choose: {
                bindInit: ['chooseGoodsConfig']
              },
              img: {
                bindInit: ['chooseBgConfig']
              }
            }
            // redirect: 'category_id'
          },
          submitForm: addSpike
        },
        formData: {
          title: '',
          state: '',
          span: '',
          cancel_time: '3',
          limit: '',
          time: [],
          channel: [],
          is_distribution: 1, // 是否分销（1：是；2：否；）
          dealer_mode: 1, // 分销模式（1：分销默认设置，2：商品单独设置），3：活动单独设置
          goods: [],
          activity_share: 20,
          share_image_id: [],
          is_custom: 10,
          custom_share_content: '',
          seckill_type: 1, // 1：普通秒杀2：整点秒杀
          activity_obj: 1, // 活动对象。1所有用户2会员卡用户3用户标签4会员群体
          wechat_set: 1, // 关注设置 1无2强制关注公众号3添加客服
          custom_follow_title: '',  //自定义关注标题
          tag_id: [], // 用户标签id
          spike_tag_id: [],  //允许活动用户标签id
          is_member: 0, // 1开启会员价0不开启
          read_setting: 1,  //读取设置：1读取本活动，2隐藏本活动
          order_limit: '', // 每单限购
          activity_limit: '', //活动限购
          spike_end_time: '', // 秒杀时长
          et_time: '', // 预热开始时间
          spikeTimes: [
            // {
            //   week: 1, //周一
            //   spike_time: 1597438240, //秒杀时间。seckill_type为2时必填
            // },
            // {
            //   week: 2, //周二
            //   spike_time: 1597438240, //秒杀时间。seckill_type为2时必填
            // },
          ],

          service_id: '' // 活动客服
        },
        rules: {
          custom_share_content: [{
            min: 4, max: 20, message: '长度在 4 到 20 个字符', trigger: 'blur'
          }],
          limit: [
            { message: '限购次数只能是正整数，如1', validator: checkPositiveInteger, trigger: ['blur', 'change'] }

          ],
          cancel_time: [
            { message: '取消时间只能是正整数，如1', validator: checkPositiveInteger, trigger: ['blur', 'change'] }
          ]
        }
      }
    }
  },

  methods: {
    getCountOfDate(start, end, weekX) {
      var result = []
      for (var i = start; i <= end; i += 86400000) {
        if (new Date(i).getDay() == weekX) {
          result.push(
            new Date(i).getFullYear() + '-' +
                (new Date(i).getMonth() + 1) + '-' +
                new Date(i).getDate()
          )
        }
      }
      return result
    },

    // 获取当前日期星期几
    getWeekDate(time) {
      var now = new Date(time)
      var day = now.getDay()
      var weeks = [7, 1, 2, 3, 4, 5, 6]
      var week = weeks[day]
      return week
    },
    // 获取日期范围内所有的星期
    getCountOfWeekX(startTime, endTime) {
      // console.log(startTime, endTime)
      var weekList = []
      while (endTime.getTime() - startTime.getTime() >= 0) {
        var year = startTime.getFullYear()
        var month =
          startTime.getMonth().toString().length === 1
            ? '0' + startTime.getMonth().toString()
            : startTime.getMonth()
        var day =
          startTime.getDate().toString().length === 1
            ? '0' + startTime.getDate()
            : startTime.getDate()
        var date = year + '-' + (parseInt(month) + 1) + '-' + day
        weekList.push(this.getWeekDate(date))
        startTime.setDate(startTime.getDate() + 1)
      }
      this.weeks.map(item => {
        item.disabled = true
      })
      weekList = [...new Set(weekList)]
      weekList.map(item => {
        this.weeks[item - 1].disabled = false
      })
    },

    changeActTime() {
      // console.log('----------------',this.seckillTime)
      const times = this.formFormatData.formData.time
      const seckillTime = this.seckillTime
      const seckillWeek = this.seckillWeek
      const res = []
      this.formFormatData.formData.et_time = ''
      if (times) {
        startTime = times[0]
        if (this.formFormatData.formData.seckill_type == 2) {
          this.getCountOfWeekX(new Date(times[0]), new Date(times[1]))
        }
      }
      seckillWeek.map(item => {
        const obj = {
          week: item,
          date_time: [],
          spike_time: [],
          dates: this.getCountOfDate(times[0], times[1], item)
        }
        obj.dates.map(item2 => {
          seckillTime.map(item3 => {
            obj.date_time.push(item2 + ' ' + item3)
            obj.spike_time.push(new Date(item2 + ' ' + item3).getTime())
          })
        })
        res.push(obj)
      })
      this.formFormatData.formData.spikeTimes = res
    },
    // 分销设置
    retailTable(scope, img, name) {
      if (scope) {
        this.$index = scope.$index
        this.imgPath = img
        this.goodsName = name
        this.formFormatData.formData.goods[scope.$index].attr.map(item => {
          item.first_grade = Number(item.first_grade) || 0
          item.second_grade = Number(item.second_grade) || 0
          item.third_grade = Number(item.third_grade) || 0
        })
        // 多规格
        if (scope.row.spec_type == 20) {
          this.dialogTableVisible = true
        } else {
          this.isShowRetailTable = true
        }
      }
    },
    saveForm() {
      if (this.couponId !== '' && (this.formFormatData.formData.couponData.suit_goods_type !== 0)) {
        this.$refs.chooseGoods.output()
      } else {
        this.formFormatData.formData.suit_goods = []
      }
      this.formFormatSubmit({ router: { type: 'replace', path: '/application/couponMarketing', code: 1 } })
    },
    filtersChange(val) {
      this.currentRow = val.currentRow
      const displayData = val.displayData
      displayData.map(item => {
        item.attr = JSON.parse(JSON.stringify([...[], ...item.sku]))
        item.attr.map(attritem => {
          if (item.spec_type === 10) {
            attritem.spec_id = -1
          } else if (item.spec_type === 20) {
            attritem.spec_id = attritem.goods_sku_id
          }
          attritem.price = ''
          attritem.stock = ''
          attritem.is_use = 1
        })
      })
      displayData.map(item => {
        var hasIndex = this.formFormatData.formData.goods.findIndex(tableitem => { return tableitem.goods_id === item.goods_id })
        if (hasIndex === -1) {
          this.formFormatData.formData.goods.push(JSON.parse(JSON.stringify(item)))
        }
      })
    },
    goodsToogle() {
      console.log('amg', this.formFormatData.formData.goods)
      const result = []
      this.formFormatData.formData.goods.map(item => {
        result.push(item.goods_id)
      })
      this.$refs.chooseGoods.currentRow = result
      this.$refs.chooseGoods.toggle()
    },
    deleteTable(scope) {
      this.formFormatData.formData.goods.splice(scope.$index, 1)
      this.currentRow.splice(scope.$index, 1)
    },
    showDialog(scope, img, name) {
      if (scope) {
        this.$index = scope.$index
        this.imgPath = img
        this.goodsName = name
        this.dialogTableVisible = true
      }
    },
    spikePriceValidate(row) {
      const goodsPrice = row.attr[0].goods_price
      const price = row.attr[0].price
      price > goodsPrice ? this.$set(row.attr[0], 'price', goodsPrice) : ''
      price < 0 ? this.$set(row.attr[0], 'price', 0) : ''
    }
  }
}
</script>

<style lang="scss" scoped>
.spike-marketing-add {
    .logo {
        height: 40px;
        width: 40px;
        border-radius: 50%;
        vertical-align: middle;
        margin-right: 6px;
    }
}
</style>
